<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html>
<!--[if IE 8 ]> <html lang="en" class="ie8"> <![endif]-->
<!--[if IE 9 ]> <html lang="en" class="ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <html lang="en"> <!--<![endif]-->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />


<!--[if lt IE 9]>
<script src="js/html5shiv.js"></script>
<![endif]-->

<link href="<%=basePath%>css/normalize.css" rel="stylesheet"/>
<link href="<%=basePath%>css/jquery-ui.css" rel="stylesheet"/>
<link href="<%=basePath%>css/jquery.idealforms.min.css" rel="stylesheet" media="screen"/>

<style type="text/css">
body{font:normal 15px/1.5 Arial, Helvetica, Free Sans, sans-serif;color: #222;background:url(pattern.png);overflow-y:scroll;padding:100px 0 0 0;}
#my-form{width:600px;margin:0 auto;border:1px solid #ccc;padding:3em;border-radius:3px;box-shadow:0 0 2px rgba(0,0,0,.2);}
</style>

<title>协作学习管理系统</title>
</head>
<body>
<div class="row">

  <div class="eightcol last">

    <!-- Begin Form -->

    <form id="my-form" method="post" action="<%=basePath%>FindPWDServlet">
		  <div><h1 style="text-align: center;color: black;font-size: 25pt;">找回密码</h1></div>
          <div><label>用户名:</label><input id="username" name="username" type="text"/></div>
          <div><label>邮箱:</label><input id="email" name="email" data-ideal="required email" type="email"/><button id="verify" type="button" style="margin-left: 30px">发送验证码</button></div>
          <div><label>邮箱验证码:</label><input id="code" name="code" type="text"/></div>
          <div><label>密码:</label><input id="pass" name="password" type="password"/></div>
          <div><label>重复密码:</label><input id="pass1" name="password1" type="password"/></div>
      <div><hr/></div>

      <div>
        <button id="submit" type="submit">提交</button>
        <button id="reset" type="button">重置</button>
        <button id="back" type="button" onclick="window.location.href='login.jsp'">返回</button>
      </div>

    </form>

    <!-- End Form -->

  </div>

</div>


<script type="text/javascript" src="<%=basePath%>js/jquery-1.8.2.min.js"></script>
<script type="text/javascript" src="<%=basePath%>js/jquery-ui.min.js"></script>
<script type="text/javascript" src="<%=basePath%>js/jquery.idealforms.js"></script>
<script type="text/javascript">
var options = {

	onFail: function(){
		alert( '请把'+$myform.getInvalid().length +'项必填的填写完整' )
	},

	inputs: {
		'password': {
			filters: 'required pass',
		},
		'code': {
			filters: 'required code',
		},
		'email': {
			filters: 'required email',
		},
		'password1': {
			filters: 'required pass',
		},
		'username': {
			filters: 'required username',
		}
	}
	
};

var $myform = $('#my-form').idealforms(options).data('idealforms');

$('#reset').click(function(){
	$myform.reset().fresh().focusFirst()
});

$('#pass1').blur(function(){
	if($('#pass1').val()!=$('#pass').val()){
		alert('两次输入的密码不一致');
	}
});

var t=60;
var timer;
function count(){
    t --;  //秒数自减
    if(t > 0){
        $('#verify').html(t+"秒后重试");  //刷新当前的秒数，重新显示秒数
    }else{
        clearInterval(timer);//这个可以不用，因为页面都要跳转了，要了也没多大差别
        t=60;
        $('#verify').attr("disabled", false).css('background','');;
        $('#verify').html("发送验证码");
    }
}

var code="";
$('#verify').click(function () {
	if(/^[A-Za-z]{3,}$/.test($('#username').val().trim())){
	}else{
		alert("必须至少有3个字符长，并且只能包含字母.");
		return;
	}
	if(/[^@]+@[^@]/.test($('#email').val().trim())){
		$.post("<%=basePath%>VerifyNameAndEmailServlet",{email:$('#email').val().trim(),username:$('#username').val().trim()},function(data,status){
			if(status=='success'&&data=='true'){
				$.post("<%=basePath%>SendEmailServlet",{to_email:$('#email').val().trim()},function(data,status){
					if(status=='success'){
						code=data;
						timer=setInterval("count()",1000);  //定义一个定时器
					    $('#verify').html(t+"秒后重试");   //显示当前的秒数
					    $('#verify').attr("disabled", true).css('background','#d3d3d3');
					}else{
						alert('验证码发送失败，请重试！');
						return;
					}
				});
			}else{
				alert('用户名和邮箱不匹配！');
				return;
			}
		});
	}else{
		alert("请输入正确的邮箱地址！");
		return;
	}
});

$('#code').blur(function(){
	if($('#code').val().trim()==""){
		return;
	}
	if(code==$('#code').val().trim()){
		
	}else{
		alert("验证码错误，请重新输入！");
		$('#code').val("");
		return;
	}
});
$myform.focusFirst();
</script>
</body>
</html>